/*
 * @Description: 全线跟踪根据SVGID修改颜色
 * @Version: 1.0
 * @Date: 2023-07-28 14:18:37
 * @LastEditTime: 2024-03-20 13:42:25
 */


/**
 * 
 * @param tiNo 
 * @param pathNo SVG线段ID
 */
import $ from 'jquery'
export const refreshSVG = (tiNo: number, pathNo: string) => {
    if (document.getElementById(pathNo) != null){
        const name = document.getElementById(pathNo)?.tagName;
        if (name==='g'){
            $(`#${pathNo} path`).css("stroke",(ColourStrategy as any)[(tiNo)]());
            if(pathNo.indexOf('CAL2150') !== -1 || pathNo.indexOf('CAL1630') !== -1){
                $(`#${pathNo} path`).css("strokeWidth",'30px');
            }else{
                $(`#${pathNo} path`).css("strokeWidth",'0.04vw');
            }
        }else {
            document.getElementById(pathNo)!.style.stroke = (ColourStrategy as any)[(tiNo)]();
            if(pathNo.indexOf('CAL2150') !== -1 || pathNo.indexOf('CAL1630') !== -1){
                document.getElementById(pathNo)!.style.strokeWidth = '30px'
            }else{
                document.getElementById(pathNo)!.style.strokeWidth = '0.03vw'
            }
        }
    }
}

export const initialSVG = (technologicalName: string,name: string,channelNo:string) => {
    refreshGraphical(-1,`${technologicalName}-ZONE_${name}${(DisplayStrategy as any)[channelNo]()}`)
    refreshSVG(-2,`${technologicalName}-ZONE_${name}${(DisplayStrategy as any)[channelNo]()}_path`)
}
export const refreshGraphical = (tiNo:number,key:string)=>{
    if (document.getElementById(key) != null)  document.getElementById(key)!.style.stroke = (ColourStrategy as any)[(-2)]();
    if (document.getElementById(key) != null)  document.getElementById(key)!.style.fill = (ColourStrategy as any)[(tiNo)]();
}


export enum ColourType {
    ZERO = 0,
    ONE = 1,
    TWO = 2,
    THREE = 3,
    FOUR = 4,
    FIVE = 5,
    SEX = 6,
    SEVEN = 7,
    EIGHT = 8,
    NINE = 9,
    INITLINE = -1,
    INITLGRAPHICAL = -2,

}
const ColourStrategy = {
    [ColourType.ZERO]: () => ("#FF6600"),
    [ColourType.ONE]: () => ("#FF00FF"),
    [ColourType.TWO]: () => ("#CC3300"),
    [ColourType.THREE]: () => ("#0099FF"),
    [ColourType.FOUR]: () => ("#F08080"),
    [ColourType.FIVE]: () => ("#C0C0C0"),
    [ColourType.SEX]: () => ("rgba(255,128,64,255)"),
    [ColourType.SEVEN]: () => ("#C71585"),
    [ColourType.EIGHT]: () => ("rgba(147,147,0,255)"),
    [ColourType.NINE]: () => ("rgba(255,128,192,255)"),
    [ColourType.INITLINE]: () => ("#5F6368"),
    [ColourType.INITLGRAPHICAL]: () => ("#1E1E1E"),
}

export enum ThoroughfareType {
    ONE = '1',
    TOW = '2',
}
const DisplayStrategy = {
    [ThoroughfareType.ONE]: () => (2),
    [ThoroughfareType.TOW]: () => (1),
}